<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        ul>li:first-child {
            color: red;
            height: calc(100vh-60px);
        }
        /* #coffee + li {
            color: red;
        } */


        [type=submit] {
            background-color: rgb(69, 76, 113);
        }

        .test_module {
            height: 400px;
            width: 400px;
            background-color: aquamarine;
        }

        #overflowTest {
    background: #4CAF50;
    color: white;
    padding: 15px;
    width: 80%;
    height: 100px;
    overflow: scroll;
    border: 1px solid rgb(150, 18, 18);
}
    </style>
</head>
<body>
    <h3 id="h3_head" class="h3_header_class">列表</h3>
    <ul id="list_menu" class="ul_class">
        <li id="coffee">Coffee</li>
        <li>Tea</li>
        <li>Milk</li>
        <div>
            <li>Div Milk</li>
        </div>
    </ul>

    <form action="demo_form.php">
        <input type="submit" value="提交">
    </form>

    <div class="test_module">
        <div>div1</div>
        <div>div2</div>
        <div>div3</div>
    </div>

    <div id="overflowTest">
        <p>这里的文本内容是可以滚动的，滚动条方向是垂直方向。</p>
        <p>这里的文本内容是可以滚动的，滚动条方向是垂直方向。</p>
        <p>这里的文本内容是可以滚动的，滚动条方向是垂直方向。</p>
        <p>这里的文本内容是可以滚动的，滚动条方向是垂直方向。</p>
        <p>这里的文本内容是可以滚动的，滚动条方向是垂直方向。</p>
        <p>这里的文本内容是可以滚动的，滚动条方向是垂直方向。</p>
    </div>
</body>
</html>